<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">

<f:view contentType="text/html;charset=UTF-8" encoding="UTF-8">
    <h:head>

    </h:head>

    <h:body>

        <h:form id="form">
            <p:messages id="msgs" showDetail="true">
                <p:autoUpdate/>
            </p:messages>

            <!-- Test Global Filter Function -->
            <p:dataTable id="datatable"
                         widgetVar="wgtTable"
                         value="#{dataTable019.progLanguages}"
                         var="lang"
                         paginator="true"
                         rows="10"
                         filteredValue="#{dataTable019.filteredProgLanguages}"
                         filterEvent="enter"
                         globalFilterFunction="#{dataTable019.globalFilterFunction}">

                <f:facet name="header">
                    <div class="p-d-flex p-jc-end">
                        <p:inputText id="globalFilter"
                                     onchange="PF('wgtTable').filter()"
                                     style="width:300px"
                                     placeholder="Search all fields using global function"/>
                    </div>
                </f:facet>

                <p:column field="id" filterable="false"/>

                <p:column field="type" filterFunction="#{dataTable019.columnFilterFunction}"/>

                <p:column field="name" filterable="false"/>

                <p:column field="firstAppeared" filterable="false"/>
            </p:dataTable>

            <p:commandButton id="button" value="Submit" update="@form"/>
        </h:form>

    </h:body>
</f:view>

</html>
